<template>
  <a-drawer
    width="640"
    placement="right"
    :closable="true"
    :visible="visible"
    @close="onClose"
    title="详情">
    <a-descriptions v-if="record" :column="1">
      <a-descriptions-item :label="item.title" v-for="(item, index) in columns" :key="index" >
        <a-avatar :size="64" :src="record[item.dataIndex]" v-if="item.dataIndex === 'head_img'"></a-avatar>
        <template v-else>{{ record[item.dataIndex] }}</template>
      </a-descriptions-item>
    </a-descriptions>
  </a-drawer>
</template>
<script>
export default {
  props: {
    columns: {
      type: Array,
      default () {
        return []
      }
    }
  },
  data () {
    return {
      visible: false,
      record: {}
    }
  },
  methods: {
    show (record) {
      this.record = record
      this.visible = true
    },
    onClose () {
      this.visible = false
    }
  }
}
</script>
